﻿<?php echo $this->Html->script('jcarousel_start'); ?>
<div class="highlight remove_top_border">
    <span id="hselected"><a href="http://localhost/dealcruncher/products/view/9"><img id="hselected_img" src="img/products/apple_iphone_5.png"/></a></span>
    <div id="hpointerlist">
        <ul>
            <li class="hpointers" id="hpointers1">
                <div class="arrow-right arrow-rightsld">
                </div>
            </li>
            <li class="hpointers" id="hpointers2">
                <div class="arrow-right">
                </div>
            </li>
            <li class="hpointers" id="hpointers3">
                <div class="arrow-right">
                </div>
            </li>
            <li class="hpointers" id="hpointers4">
                <div class="arrow-right">
                </div>
            </li>
        </ul>
    </div>
    <div id="hlist">
        <ul>
            <li class="hitems" id="hitems1">
            	<?=$html->image('products/apple_iphone_5.png', array(
                    'class' => 'hlimg', 'width' => '100%', 'height' => '80%',
                    'link' => 'http://localhost/dealcruncher/products/view/9'))?>
            </li>
            <li class="hitems" id="hitems2">
            	<?=$html->image('products/samsung_galaxy_s3.png', array(
                    'class' => 'hlimg', 'width' => '100%', 'height' => '80%',
                    'link' => 'http://localhost/dealcruncher/products/view/18'))?>
            </li>
            <li class="hitems" id="hitems3">
            	<?=$html->image('products/amazon_kindleFire.png', array(
                    'class' => 'hlimg', 'width' => '100%', 'height' => '80%',
                    'link' => 'http://localhost/dealcruncher/products/view/16'))?>
            </li>
            <li class="hitems" id="hitems4">
            	<?=$html->image('products/apple_macbook_air.png', array(
                    'class' => 'hlimg', 'width' => '100%', 'height' => '80%',
                    'link' => 'http://localhost/dealcruncher/products/view/8'))?>
            </li>
        </ul>
    </div>
</div>
<div class="contentMain">
<div class="grayBox">
<div class="featured">
    <h2 class="title" style="margin-left:30px">BEST RATED<div class="btn btn-reset" id="view_best_rated">View All</div></h2>
    <div class="content">
        <div class=" jcarousel-skin-tango"><div class="jcarousel-container jcarousel-container-horizontal" style="position: relative; display: block; "><div class="jcarousel-clip jcarousel-clip-horizontal" style="position: relative; "><ul id="mycarousel1" class="jcarousel-list jcarousel-list-horizontal" style="overflow: hidden; position: relative; top: 0px; margin: 0px; padding: 0px; left: 0px; width: 1150px; ">
        <?php foreach($best_selling as $post) { ?>
            <li class="jcarousel-item jcarousel-item-horizontal jcarousel-item-1 jcarousel-item-1-horizontal" style="float: left; list-style: none; " jcarouselindex="1">
                <a href="<?=$this->webroot.'products/view/'.$post['Product']['id']?>">
                <?=$html->image($thumb->image('posts/'.$post['Product']['image']), array('style'=>'width:100%;height:100%;'));?>
                buy 2 iphone4s, get 1 free!
                </a>
            </li>
        <?php } ?>
        </ul></div><div class="jcarousel-prev jcarousel-prev-horizontal" style="display: block; " disabled="false"></div><div class="jcarousel-next jcarousel-next-horizontal" style="display: block; " disabled="false"></div></div></div>
    </div>
</div>
<div class="featured">
    <h2 class="title" style="margin-left:30px">MOST POPULAR<div class="btn btn-reset" id="view_most_viewed">View All</div></h2>
    <div class="content">
        <div class=" jcarousel-skin-tango"><div class="jcarousel-container jcarousel-container-horizontal" style="position: relative; display: block; "><div class="jcarousel-clip jcarousel-clip-horizontal" style="position: relative; "><ul id="mycarousel2" class="jcarousel-list jcarousel-list-horizontal" style="overflow: hidden; position: relative; top: 0px; margin: 0px; padding: 0px; left: 0px; width: 1150px; ">
        <?php foreach($most_viewed as $post) { ?>
            <li class="jcarousel-item jcarousel-item-horizontal jcarousel-item-1 jcarousel-item-1-horizontal" style="float: left; list-style: none; " jcarouselindex="1">
                <a href="<?=$this->webroot.'products/view/'.$post['Product']['id']?>">
                <?=$html->image($thumb->image('posts/'.$post['Product']['image']), array('style'=>'width:100%;height:100%;'));?>
                buy 2 iphone4s, get 1 free!
                </a>
            </li>
        <?php } ?>
        </ul></div><div class="jcarousel-prev jcarousel-prev-horizontal" style="display: block; " disabled="false"></div><div class="jcarousel-next jcarousel-next-horizontal" style="display: block; " disabled="false"></div></div></div>
    </div>
</div>
</div></div>
